<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>Go To</title>
    <style>
        body {
          font-family: Arial, sans-serif;
          background: #f4f4f4;
          display: flex;
          justify-content: center;
          align-items: center;
          height: 100vh;
          margin: 0;
        }

        .container {
          background: white;
          padding: 30px 40px;
          border-radius: 10px;
          box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
          text-align: center;
          width: 100%;
          max-width: 400px;
        }

        h2 {
          margin-bottom: 20px;
          color: #333;
        }

        input[type="text"] {
          width: 100%;
          padding: 10px 15px;
          margin-bottom: 15px;
          border: 1px solid #ccc;
          border-radius: 6px;
          font-size: 16px;
          box-sizing: border-box;
        }

        button {
          background-color: #007BFF;
          color: white;
          padding: 10px 20px;
          font-size: 16px;
          border: none;
          border-radius: 6px;
          cursor: pointer;
          transition: background-color 0.3s ease;
        }

        button:hover {
          background-color: #0056b3;
        }

        input:focus {
          outline: none;
          border-color: #007BFF;
          box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25);
        }
    </style>
</head>
<body>

<div class="container">
    <h2>Go To</h2>
    <input type="text" id="urlInput" placeholder="www.example.com">
    <button onclick="goToUrl()">Go to</button>
</div>

<script>
    function goToUrl() {
      let url = document.getElementById('urlInput').value.trim();

      if (url !== '') {
        if (!/^https?:\/\//i.test(url)) {
          url = 'http://' + url;
        }
        window.location.href = url;
      } else {
        alert("Please input valid url.");
      }
    }
</script>

</body>
</html>